<template>
  <div class="bg_fff main">
    <div class="btn-list">
      <el-button type="primary" icon="el-icon-refresh" size="small" @click="refreshAction">刷新</el-button>
    </div>
    <h3 class="title">
      <i class="el-icon-user-solid"></i>苹果版本管理
    </h3>
    <el-form :inline="true" :model="formInline" class="demo-form-inline">
      <span>版本:</span>
      <el-select v-model="valueedition" placeholder="全部">
        <el-option label="全部" value=""></el-option>
        <el-option
          v-for="item in ioslist"
          :key="item.value"
          :label="item.edition"
         :value="item.edition"
        ></el-option>
         
      </el-select>
      <span>渠道:</span>
      <el-select v-model="valuechannel" placeholder="全部">
        <el-option label="全部" value=""></el-option>
        <el-option
          v-for="item in ioslist"
          :key="item.value"
          :label="item.channel"
          :value="item.channel"
        ></el-option>
          
      </el-select>
        <el-button type="primary" @click="getLoadUserLossList">查询</el-button>
      <el-form-item>
        <el-button type="danger" @click="dialogFormVisiblelist= true">添加</el-button>
      </el-form-item>
    </el-form>


<el-dialog title="添加版本"  :visible.sync="dialogFormVisiblelist">
 <el-form :model="formlist">
    <el-form-item label="版本" :label-width="formLabelWidth">
      <el-input v-model="formlist.edition" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item label="渠道" :label-width="formLabelWidth">
      <el-select v-model="formlist.channel" placeholder="全部">
         <el-option label="全部" value=""></el-option>
        <el-option   v-for="itemi in ioslist"
          :key="itemi.value"
          :label="itemi.channel"
          :value="itemi.channel"></el-option>
     
      </el-select>
    </el-form-item>
     
      <el-form-item label="更新内容" :label-width="formLabelWidth">
    <el-input type="textarea" v-model="formlist.content"></el-input>
  </el-form-item>
       <el-form-item label="备注" :label-width="formLabelWidth">
      <el-input v-model="formlist.remakes" autocomplete="off"></el-input>
    </el-form-item>

     <el-button size="100" type="info" @click="addIosVersion">提交</el-button>
  </el-form>
</el-dialog>

    <div class="p10">
      <el-table :data="tableData" stripe border style="width: 100%">
        <el-table-column  label="序号" header-align="center" align="center">
             <template slot-scope="scope">
            <span>{{scope.$index + 1}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="edition" label="版本" header-align="center" align="center"></el-table-column>
         <el-table-column prop="channel" label="渠道" header-align="center" align="center"></el-table-column>
        <el-table-column prop="content" label="更新内容" header-align="center" align="center"></el-table-column>
        <el-table-column prop="cadddate" label="添加时间" header-align="center" align="center"></el-table-column>
        <el-table-column prop="optname" label="操作人" header-align="center" align="center"></el-table-column>
        <el-table-column prop="remakes" label="备注" header-align="center" align="center"></el-table-column>
    
      </el-table>
    </div>

    <div class="block p20 tac">
      <el-pagination
        style="margin-top: 16px; text-align:center;"
        layout="total, prev, pager, next"
        :total="total"
        :page-size="formInline.pageSize"
        :current-page.sync="formInline.pageNo"
        @current-change="handleCurrentChange"
      ></el-pagination>
    </div>

    <div>
      
    </div>
  </div>
</template>
<script>
import { findAllIosVersion, allDataByIos,addIosVersion } from "@/request/api";
export default {
  data() {
    return {
      total: 0,
      formInline: {
        mobileNo: "",
        nickName: "",
        cfrom: "",
        startDate: "",
        endDate: "",
        pageNo: 1,
        pageSize: 20,
        dialogFormVisible:false
      },
    
      valueedition: "",
      valuechannel:"",
      timer: "",
      tableData: [],
      ioslist:[],
       formlist: {
          edition: '',
          channel: '',
          content: '',
          remakes: '',
        },
        formLabelWidth: '120px',
        dialogFormVisiblelist:false
    };
  
  },
  methods: {
    //查看
    lookAction(index, row) {
      this.$router.push({
        path: "/userInfo/detail",
        query: {
          userid: row.cuserid
        }
      });
    },
    getLoadUserLossList() {
      findAllIosVersion({
        pageNo:1,
        pageSize:20,
        edition:this.valueedition,
        channel:this.valuechannel
      }).then(res => {
        console.log(res);

        if (res.data.code == 200) {
          this.tableData = res.data.data.list;
          this.total = parseInt(res.data.data.total);
        }
      });
    },
    refreshAction() {
       this.valueedition=""
      this.valuechannel=""
      this.getLoadUserLossList();

    },
    addIosVersion(){
      console.log(this.formlist);
      
          addIosVersion(this.formlist).then(res=>{
            console.log(res);
            if(res.data.code=="200"){
                 this.dialogFormVisiblelist = false
                  this.$message({
          message: '添加成功',
          type: 'success'
        });
        this.getLoadUserLossList();
            }else{
                this.$message({
          message: '添加失败',
          type: 'warning'
        });
            }
          })
    },
    getallDataByIos() {
       return allDataByIos().then(res => {
        console.log(res);
        let arr = res.data.data

function unique(arr){
    return Array.from(new Set(arr));
}




        this.ioslist=unique(arr)
      });
    },
    onSubmit() {
      if (this.formInline.endDate == "" && this.formInline.startDate != "") {
        this.formInline.endDate = this.timer;
      }
      this.formInline.pageNo = 1;
      this.getLoadUserLossList();
    },
    //分页器
    handleCurrentChange(pgno) {
      this.formInline.pageNo = pgno;
      this.getLoadUserLossList();
    }
  },
  created() {
    this.getLoadUserLossList();
    this.getallDataByIos();
  },
  beforeDestroy() {
    if (this.timer) {
      clearInterval(this.timer); // 在Vue实例销毁前，清除我们的定时器
    }
  }
};
</script>
<style lang='less' scoped>
.demo-form-inline {
  text-align: left;
  padding: 5px;
}
</style>
